<script setup lang="ts">
import { useRouter } from 'vue-router';
import type { Banner } from '@/types/home.ts';

const $router = useRouter();
defineProps<{
  banner: Banner[];
}>();
const onImgClick = (item: Banner) => {
  if (item.floorInfoUrl === '跳转店铺') {
    $router.push({
      path: '/store',
      query: { supplierId: item.floorInfoVal },
    });
  } else {
    // 跳转商品
    $router.push({
      path: `/goodsDetails/${item.floorInfoVal}`,
    });
  }
};
</script>

<template>
  <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
    <van-swipe-item v-for="item in banner" :key="item.id">
      <van-image @click="onImgClick(item)" fit="cover" :src="item.floorInfoImg" />
    </van-swipe-item>
  </van-swipe>
</template>

<style scoped lang="scss">
.my-swipe {
  margin: 4px 0;
  width: 100%;
  height: 119px;
  text-align: center;
}
</style>
